import React from 'react'
import { Button, Card, Form, Input } from 'antd'
import './index.scss'
const Login = () => {
    const onFinish = (values) => {
        console.log(values);
        
    }
    return (
    <div className='login'>
        <Card className='login-container'>
            <h4>达利园</h4>
            <Form validateTrigger="onBlur" onFinish={onFinish}>
                <Form.Item
                    name="mobile"
                    rules={[
                        {
                            required: true,
                            message: '请输入手机号!',
                        },
                        {
                            pattern: /^1[3-9]\d{9}$/,
                            message: '手机号格式不正确!',
                        }
                    ]}
                >
                    <Input size='large' placeholder='请输入手机号码' />
                </Form.Item>
                <Form.Item
                    name="code"
                    rules={[
                        {
                            required: true,
                            message: '请输入验证码!',
                        },
                    ]}
                >
                    <Input size='large' placeholder='请输入验证码' />
                </Form.Item>
                <Form.Item>
                    <Button type="primary" htmlType="submit" size='large' block>
                        登录
                    </Button>
                </Form.Item>
            </Form>
        </Card>
    </div>
)
};
export default Login